import React, { Component } from 'react';
import './Mytabbar.scss'

class Mytabbar extends Component {
    constructor(props){
        super(props);
        this.state = {
            currentIndex:0,
            arr : ['店铺','分类','全部商品','购物车','个人中心']
        }
    }
    handClick(index){
        this.setState({
            currentIndex:index 
        })
    }

    render(){
        return (
            <div className="tabbar">
                {
                    this.state.arr.map((item,index)=>{
                        return(
                            <div className="dibu" key={index} style={{color: this.state.currentIndex == index ? 'red' : ''}} onClick={()=>{
                                this.handClick(index) 
                            }} >
                                <div className="name">{item}</div>
                            </div>
                        )
                    })
                }
            </div>
        );
    }
}



export default Mytabbar;